/**
 * Created by xlt on 2017/5/8.
 */
/**
 * Created by xlt on 2017/5/2.
 */
import React from "react";
import {connect} from "react-redux";
import cookie from "react-cookie";
import {fetchPosts, reset} from "../../actions";
import {Link} from "react-router";
import MallMenu from "../../components/MallMenu";

class mine extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            isLoading: true,
            waitPayNumber: 0,
            waitSendNumber: 0,
            waitReceiveNumber: 0,
            shoppingCartCount: 0
        }
    }

    componentWillMount() {
        document.title = "我的";
    }

    componentDidMount() {
        const header = {"X-Client-ID": "123456", "X-Long-Token": cookie.load("token")}
        this.props.dispatch(reset("myOrderStatus"))
        this.props.dispatch(fetchPosts("myOrderStatus", header))
    }

    componentWillUnmount() {

    }

    componentWillReceiveProps(nextProps) {
        console.log("errorCode" + nextProps.myOrderStatus.errorCode);
        let shoppingCartCount = this.getShoppingCartAccount();
        if (nextProps.myOrderStatus.errorCode == 0) {
            const orderStatus = nextProps.myOrderStatus.data.orderStatusNumVo;
            this.setState({
                isLoading: false,
                waitPayNumber: orderStatus.waitPayNum,
                waitSendNumber: orderStatus.waitDeliverGoods,
                waitReceiveNumber: orderStatus.waitReceiveGoods,
                shoppingCartCount: shoppingCartCount
            });
        } else if (nextProps.myOrderStatus.errorMessage) {
            alert("您的账号已在别处登录！")
            //alert("错误代码: " + nextProps.myOrderStatus.errorCode + ", 错误消息: " +nextProps.myOrderStatus.errorMessage);
        }
    }

    getShoppingCartAccount() {
        let shoppingCartCount = 0;
        let shoppingCarItemList = cookie.load("shoppingCarItemList") || [];
        if (shoppingCarItemList.length > 0) {
            console.log("_checkedAll--componentWillReceiveProps");
            shoppingCarItemList.map((item) => {
                console.log("_checkedAll--componentWillReceiveProps" + item.isChecked);
                shoppingCartCount += item.buyNumber;
            });
        }
        return shoppingCartCount;
    }

    rendWaitPayTips() {
        if (this.state.waitPayNumber > 0) {
            return (
                <i className="red-notice">{this.state.waitPayNumber}</i>
            )
        }
    }

    rendWaitSendTips() {
        if (this.state.waitSendNumber > 0) {
            return (
                <i className="send-notice">{this.state.waitSendNumber}</i>
            )
        }
    }

    rendWaitReceiveTips() {
        if (this.state.waitReceiveNumber > 0) {
            return (
                <i className="get-notice">{this.state.waitReceiveNumber}</i>
            )
        }
    }

    render() {
        if (this.state.isLoading) {
            return (
                <div className="loading"><span>loading</span></div>
            );
        } else {
            return (
                <div>
                    <div className="mine-order">
                        <ul>
                            <li>
                                <Link to={`mall/myOrder`}>我的订单</Link>
                            </li>
                        </ul>
                    </div>
                    <div className="mine-list">
                        <ul>
                            <Link to="mall/myOrderPay">
                                <li><span className="later-pay"/>待付款</li>
                            </Link>
                            {this.rendWaitPayTips()}
                            <Link to="mall/myOrderSend">
                                <li><span className="later-deliver"/>待发货</li>
                            </Link>
                            {this.rendWaitSendTips()}
                            <Link to="mall/myOrderReceipt">
                                <li><span className="later-receipt"/>待收货</li>
                            </Link>
                            {this.rendWaitReceiveTips()}
                        </ul>
                    </div>
                    <div className="mine-address">
                        <ul>
                            <li>
                                <Link to="mall/addressList"><span className="address-font">地址管理</span></Link>
                            </li>
                        </ul>
                    </div>

                    {/*菜单*/}
                    <MallMenu clickIndex="2" shoppingCartCount={this.state.shoppingCartCount}/>
                </div>
            );
        }
    }

}

function mapStateToProps(state) {
    const {postsByApi} = state;
    const {
        isFetching,
        items: myOrderStatus
    } = postsByApi["myOrderStatus"] || {
        isFetching: false,
        items: {}
    };
    return {
        isFetching,
        myOrderStatus
    };
}

export default connect(mapStateToProps)(mine);